<%@ page language="java" pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jstl/core_rt" prefix="c"%>
<!DOCTYPE html>
<html lang="en">
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
  <meta charset="utf-8">
  <!-- Title and other stuffs -->
  <title>找回密码</title> 
  <meta name="keywords" content="找回密码,工作协作系统" />
  <meta name="description" content="工作协作系统找回密码页" />
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta name="author" content="">
  <!-- Stylesheets -->
  <link rel="stylesheet" href="${ProjectName}/style/bootstrap.css">
  <link rel="stylesheet" href="${ProjectName}/style/font-awesome.css">
  <link rel="stylesheet" href="${ProjectName}/style/style.css">
  <link rel="stylesheet" href="${ProjectName}/style/bootstrap-responsive.css">
  
  <!-- HTML5 Support for IE -->
  <!--[if lt IE 9]>
  <script src="${ProjectName}/js/html5shim.js"></script>
  <![endif]-->

  <!-- Favicon -->
  <link rel="shortcut icon" href="${ProjectName}/img/favicon/favicon.ico">
</head>

<body onload="myScript()">

<div class="admin-form">
  <div class="container">
    <div class="row">
      <div class="col-lg-12">
        <!-- Widget starts -->
        <div class="widget wred">
          <div class="widget-head">
            <i class="icon-lock"></i> 找回密码 
          </div>
          <div class="widget-content">
            <div class="padd">
              
              <form id="frmFindPassword" class="form-horizontal" action="/EMS/FindPasswordServlet" method="post">
                <!-- Registration form starts -->
                <!-- LoginName -->
                <div class="form-group">
                  <label class="control-label col-lg-3">登录名</label>
                  <div class="col-lg-9">
                    <input type="text" class="form-control" id="txtLoginName" name="txtLoginName" placeholder="登录名">
                    <span id="spanLoginNameNotNull" class="label label-danger" style=" display: none !important; " >登录名不能为空</span>
                    <span id="spanLoginNameFormatError" class="label label-danger" style=" display: none !important; " >登录名长度不能少于5个字符</span>
                  </div>
                </div>
                <!-- Email -->
                <div class="form-group">
                  <label class="control-label col-lg-3">电子邮箱</label>
                  <div class="col-lg-9" style=" float: left; " >
                    <input type="text" class="form-control" id="txtEmail" name="txtEmail" placeholder="电子邮箱">
                    <span id="spanEmailNotNull" class="label label-danger" style=" display: none !important; " >电子邮箱不能为空</span>
                    <span id="spanEmailFormatError" class="label label-danger" style=" display: none !important; " >电子邮箱格式错误</span>
                  </div>
                </div>
                <!-- Accept box and button s-->
                <div class="form-group">
                  <div class="col-lg-9 col-lg-offset-3">
                    <button type="submit" class="btn btn-danger">找回</button>
                    <button type="reset" class="btn btn-success">重填</button>
                  </div>
                </div>
                <br />
              </form>

            </div>
          </div>
          <div class="widget-foot">
                                  不找了<a href="LoginServlet">返回登录页</a>
          </div>
        </div>  
      </div>
    </div>
  </div> 
</div>

<!-- JS -->
<script src="${ProjectName}/js/jquery.js"></script>
<script src="${ProjectName}/js/bootstrap.js"></script>
<script type="text/javascript">
$(document).ready(function(){
  var loginNameCanFindPassword = true;
  var emailCanFindPassword = true;
  var cardIdCanFindPassword = true;
  var phoneNumberCanFindPassword = true;
  
  var checkLoginName = function() {
    var txtLoginName = $("#txtLoginName").val();
    if(txtLoginName.length <= 0)
      $("#spanLoginNameNotNull").show();
    else {
      $("#spanLoginNameNotNull").hide();
    
      if (txtLoginName.length < 5)
        $("#spanLoginNameFormatError").show();
      else {
        $("#spanLoginNameFormatError").hide();
        return true;
      }
    }
    return false;
  };
  var checkEmail = function() {
    var txtEmail = $("#txtEmail").val();
    if(txtEmail.length <= 0)
      $("#spanEmailNotNull").show();
    else {
      $("#spanEmailNotNull").hide();
    
      var patten = new RegExp(/^[\w-]+(\.[\w-]+)*@([\w-]+\.)+[a-zA-Z]+$/);
      if (txtEmail.length > 0 && !patten.test(txtEmail))
        $("#spanEmailFormatError").show();
      else {
        $("#spanEmailFormatError").hide();
        return true;
      }
    }
    return false;
  };
  
  var checkCardId = function() { 
    var txtCardId = $("#txtCardId").val();
    if(txtCardId.length <= 0)
      $("#spanCardIdNotNull").show();
    else {
      $("#spanCardIdNotNull").hide();
    
      var patten = new RegExp(/(^\d{15}$)|(^\d{18}$)|(^\d{17}[Xx]$)/);
      if (txtCardId.length > 0 && !patten.test(txtCardId))
        $("#spanCardIdFormatError").show();
      else {
        $("#spanCardIdFormatError").hide();
        return true;
      }
    }
    return false;
  };
  
  var checkPhoneNumber = function() {	
    var txtPhoneNumber = $("#txtPhoneNumber").val();
    if(txtPhoneNumber.length <= 0)
      $("#spanPhoneNumberNotNull").show();
    else {
      $("#spanPhoneNumberNotNull").hide();
    
      var isMobile = new RegExp(/^1\d{10}$/);
      if (txtPhoneNumber.length > 0 && !isMobile.test(txtPhoneNumber))
        $("#spanPhoneNumberFormatError").show();
      else {
        $("#spanPhoneNumberFormatError").hide();
        return true;
      }
    }
    return false;
  };
  
  $("#txtLoginName").blur(checkLoginName);
  $("#txtEmail").blur(checkEmail);
  $("#txtCardId").blur(checkCardId);
  $("#txtPhoneNumber").blur(checkPhoneNumber);
  
  $("#frmFindPhoneNumber").submit(function() {	// 提交
    var flag = true;
    if (!checkLoginName())
      flag = false;
    if (!checkEmail())
      flag = false;
    if (!checkCardId())
      flag = false;
    if (!checkPhoneNumber())
      flag = false;
 
    return flag && loginNameCanFindPassword && emailCanFindPassword
                && cardIdCanFindPassword && phoneNumberCanFindPassword;
  });

  $(window).load(function() {
    ${requestScope['MyScript']}
  });
});
</script>
</body>
</html>